/*
 * @Author: 小花
 * @Date: 2022-05-21 17:36:21
 * @LastEditors: 小花
 * @LastEditTime: 2022-05-28 17:35:38
 * @FilePath: /permission_client/src/router/index.ts
 * @Description:
 */
import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router'
import LoginView from '@/views/LoginView.vue'
import { IMenu } from '@/model/MenuView'
import { useStore } from '@/store'

const routes: Array<RouteRecordRaw> = [
  {
    path: '/login',
    name: 'LoginView',
    component: LoginView
  },
  {
    path: '/',
    name: 'LayoutView',
    meta: { auth: true },
    component: () => import('@/layouts/LayoutView.vue'),
    redirect: '/HomeView',
    children: []
  }
  // {
  //   path: '/HomeView',
  //   name: '主页',
  //   component: () => import('@/views/HomeView.vue')
  // },
  // {
  //   path: '/SystemView',
  //   name: '系统管理',
  //   component: () => import('@/views/SystemView.vue'),
  //   redirect: '/SystemView/UserView',
  //   children: [
  //     {
  //       path: '/SystemView/UserView',
  //       name: '用户管理',
  //       component: () => import('@/views/UserView.vue')
  //     },
  //     {
  //       path: '/SystemView/RoleView',
  //       name: '角色管理',
  //       component: () => import('@/views/RoleView.vue')
  //     },
  //     {
  //       path: '/SystemView/MenuView',
  //       name: '菜单管理',
  //       component: () => import('@/views/MenuView.vue')
  //     },
  //     {
  //       path: '/SystemView/MenuTypeView',
  //       name: '菜单类型管理',
  //       component: () => import('@/views/MenuTypeView.vue')
  //     }
  //   ]
  // }
]

const router = createRouter({
  history: createWebHistory(process.env.BASE_URL),
  routes
})

let isFlag = false // 这个是用于判断动态路由是否已经被获取

const dynamicAddRoute = (routes: IMenu[]) => {
  routes.forEach(item => {
    const route: RouteRecordRaw = {
      path: item.path,
      name: item.name,
      component: () => import(`@/${item.component}.vue`),
      redirect: item.redirect,
      children: []
    }
    if (item.children && item.children.length) {
      route.children = handlerChildren(item.children)
    }
    router.addRoute('LayoutView', route)
  })

  // 将404添加进去
  // 现在才添加的原因是：作为一级路由，当刷新，动态路由还未加载，路由就已经做了匹配，找不到就跳到了404
  if (!router.hasRoute('404')) {
    router.addRoute({
      path: '/:pathMatch(.*)',
      name: '404',
      component: () => import('@/views/404View.vue')
    })
  }
  return true
}

const handlerChildren = (childs: IMenu[], result = [] as RouteRecordRaw[]) => {
  for (const child of childs) {
    result.push({
      path: child.path,
      name: child.name,
      component: () => import(`@/${child.component}.vue`),
      redirect: child.redirect,
      children: []
    })
    if (child.children && child.children.length) {
      handlerChildren(child.children, result)
    }
  }
  return result
}

router.beforeEach(to => {
  if (to.path === '/login') {
    return true
  }

  const store = useStore()
  if (!store.loginInfo.satoken) {
    return { path: '/login' }
  } else {
    console.log('isFlag', isFlag)
    if (isFlag) {
      return true
    } else {
      dynamicAddRoute(store.loginInfo.routes)
      // 更改控制生成路由次数的值
      isFlag = true
      return { ...to, replace: true }
    }
  }
})

export default router
